import VariableSizeList from '@/components/VariableSizeList';
import VirtualList from '@/components/VirtualList';
import React from 'react';
import styles from './index.less';
const Raw = ({ style, data }) => {
  return (
    <div
      className={[data % 2 ? styles.odd : styles.even, styles.common].join(' ')}
      style={style}
    >{`Raw ${data}`}</div>
  );
};

const List: React.FC<any> = () => {
  return (
    <>
      <VirtualList
        containerHeight={200}
        containerWidth={200}
        itemHeight={50}
        list={new Array(10000).fill(0)}
        ItemBox={Raw}
      ></VirtualList>
      <VariableSizeList
        height={200}
        width={200}
        itemHeight={50}
        list={new Array(10000).fill(0)}
      >
        {Raw}
      </VariableSizeList>
    </>
  );
};
export default List;
